/*** VIDEO CONTROLS CSS ***/
/* control holder */
.player_control{
    background:#333;
    color:#ccc;
    position:absolute;
    bottom:0;
    left:0;
    width:100%;
    z-index:5;
    display:none;
}
/* control top part */

/* control bottom part */
.player_control .btmControl{
    clear:both;
    background: #1F1F1F; /* fallback */
    background:-moz-linear-gradient(top,#242424 50%,#1F1F1F 50%,#171717 100%);
    background:-webkit-linear-gradient(top,#242424 50%,#1F1F1F 50%,#171717 100%);
    background:-o-linear-gradient(top,#242424 50%,#1F1F1F 50%,#171717 100%);
}
.player_control div.btn {
    float:left;
    width:34px;
    height:30px;
    padding:0 5px;
    border-right:1px solid #404040;
    cursor:pointer;
}

.player_control div.btnPlay{
    background:url(../img/control.png) no-repeat 0 0;
    border-left:1px solid #404040;
    border-top: 1px solid #404040;
    border-bottom: 1px solid #404040;
}
.player_control div.paused{
    background:url(../img/control.png) no-repeat 0 -30px;
}
.player_control div.sound{
    background:url(../img/control.png) no-repeat -88px -30px;
    border:none;
    float:right;
}
.player_control div.sound2{
    background:url(../img/control.png) no-repeat -88px -60px !important;
}
.player_control div.muted{
    background:url(../img/control.png) no-repeat -88px 0 !important;
}
/* VOLUME BAR CSS */
/* volume bar */
.player_control .volume{
    position:relative;
    cursor:pointer;
    width:70px;
    height:10px;
    float:right;
    margin-top:10px;
    margin-right:10px;
}
.player_control .volumeBar{
    display:block;
    height:100%;
    position:absolute;
    top:0;
    left:0;
    background-color:#eee;
    z-index:10;
}

.player_control .topControl{
    height:11px;
    border-bottom:1px solid #404040;
    padding:1px 5px;
    background:#1F1F1F; /* fallback */
    background:-moz-linear-gradient(top,#242424 50%,#1F1F1F 50%,#171717 100%);
    background:-webkit-linear-gradient(top,#242424 50%,#1F1F1F 50%,#171717 100%);
    background:-o-linear-gradient(top,#242424 50%,#1F1F1F 50%,#171717 100%);
}


/* PROGRESS BAR CSS */
/* Progress bar */
.player_control .progress {
    width:80%;
    height:10px;
    position:relative;
    float:left;
    cursor:pointer;
    background: #444; /* fallback */
    background:-moz-linear-gradient(top,#666,#333);
    background:-webkit-linear-gradient(top,#666,#333);
    background:-o-linear-gradient(top,#666,#333);
    box-shadow:0 2px 3px #333 inset;
    -moz-box-shadow:0 2px 3px #333 inset;
    -webkit-box-shadow:0 2px 3px #333 inset;
    border-radius:10px;
    -moz-border-radius:10px;
    -webkit-border-radius:10px;
    margin-bottom:0px
}
.player_control .progress span {
    height:100%;
    position:absolute;
    top:0;
    left:0;
    display:block;
    border-radius:10px;
    -moz-border-radius:10px;
    -webkit-border-radius:10px;
}
.player_control .timeBar{
    z-index:10;
    width:0;
    background: #3FB7FC; /* fallback */
    background:-moz-linear-gradient(top,#A0DCFF 50%,#3FB7FC 50%,#16A9FF 100%);
    background:-webkit-linear-gradient(top,#A0DCFF 50%,#3FB7FC 50%,#16A9FF 100%);
    background:-o-linear-gradient(top,#A0DCFF 50%,#3FB7FC 50%,#16A9FF 100%);
    box-shadow:0 0 1px #fff;
    -moz-box-shadow:0 0 1px #fff;
    -webkit-box-shadow:0 0 1px #fff;
}
.player_control .bufferBar{
    z-index:5;
    width:0;
    background: #777;
    background:-moz-linear-gradient(top,#999,#666);
    background:-webkit-linear-gradient(top,#999,#666);
    background:-o-linear-gradient(top,#999,#666);
    box-shadow:2px 0 5px #333;
    -moz-box-shadow:2px 0 5px #333;
    -webkit-box-shadow:2px 0 5px #333;
}
/* time and duration */
.player_control .time{
    width:20%;
    float:right;
    text-align:center;
    font-size:11px;
    line-height:12px;
}
